<!DOCTYPE html>
<html>

<head>
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <script src="js/jquery-3.2.0.min.js" type="text/javascript"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        
        body {
            margin: 0;
            padding: 0;
            height: 100%;
            background: #FFFFFF;
            overflow-x: hidden;
        }
        
        .container {
            position: absolute;
            width: 100%;
            height: 100%;
            display: none;
        }
        
        .download_wrap {
            position: absolute;
            display: inline-block;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            text-align: center;
        }
        
        .download_wrap img {
            width: 4em;
            height: 4em;
        }
        
        .download_wrap h3 {
            margin: 0;
            padding: 0;
        }
        
        .app_icon_div {
            position: relative;
            margin: 0.8em 1em;
            height: 5em;
        }
        
        .app_icon_div .app_icon {
            width: 5em;
            height: 100%;
            line-height: 5em;
            border: solid #EEEEEE 1px
        }
        
        .app_icon_div .app_info {
            display: inline-block;
            position: absolute;
            width: 70%;
            height: 100%;
            margin-left: 0.8em;
        }
        
        .app_icon_div .app_table {
            height: 100%;
        }
        
        .app_size_downtimes {
            margin: -0.5em 1em 0 1em;
            display: inline-block;
        }
        
        .app_downtimes {
            display: inline-block;
        }
        
        .app_desc_div {
            position: relative;
            margin: 0.7em 1em;
        }
        
        .app_desc_div .app_desc {
            text-indent: 2em;
            margin: 0.5em 0 0 0;
            word-spacing: 3em;
        }
        
        .bottom {
            position: fixed;
            bottom: 0;
            height: 3.5em;
            background: white;
            border-top: 1px solid gray;
            width: 100%;
            text-align: center;
        }
        
        .bottom .app_open {
            display: inline-block;
            position: absolute;
            left: 50%;
            margin: 0;
            top: 50%;
            height: 2em;
            width: 50%;
            border-radius: 0.5em;
            text-align: center;
            line-height: 2.1em;
            border: #888888 solid 1px;
            background: transparent;
            transform: translate(-50%, -50%);
        }
        
        .app_open:link {
            text-decoration: none;
            color: black;
            background: white;
        }
        
        .app_open:visited {
            text-decoration: none;
            color: black;
            background: white;
        }
        
        .app_open:hover {
            text-decoration: none;
            color: black;
            background: white;
        }
        
        .app_open:active {
            text-decoration: none;
            color: black;
            background: #DDDDDD;
        }
        
        .wx_tip {
            width: 100%;
            height: 100%;
            background-color: rgb(0, 0, 0);
            opacity: 0.9;
            position: fixed;
            display: none;
            text-align: center
        }
        
        #full_preview_div {
            width: 100%;
            height: 100%;
            background-color: rgb(0, 0, 0);
            position: fixed;
            text-align: center;
            display: none;
            text-align: center
        }
        
        #app_not_found {
            width: 100%;
            height: 100%;
            background-color: #FFFFFF;
            position: fixed;
            text-align: center;
            display: none;
            text-align: center
        }
        
        #progress_div {
            width: 100%;
            height: 100%;
            background-color: #FFFFFF;
            position: fixed;
            display: none;
            text-align: center
        }
        
        #progress_div img {
            position: absolute;
            top: 50%;
            left: 50%;
            display: none;
            transform: translate(-50%, -50%)
        }
        
        .img_preview {
            margin: 1em 1em 4.0em 1em;
            text-align: center;
            overflow-x: auto;
            width: auto;
            height: auto;
        }
        
        .img_preview ul {
            width: 2000em;
            white-space: nowrap;
            text-align: center;
        }
        
        .img_preview li {
            list-style: none;
            float: left;
            width: auto;
            padding-left: 5px;
            padding-right: 5px;
        }
        
        .img_preview li img {
            max-width: 150px;
            max-height: 300px;
        }
    </style>
    <script type="text/javascript">
        var browser = {
            versions: function() {
                var u = navigator.userAgent,
                    app = navigator.appVersion;
                return {
                    trident: u.indexOf('Trident') > -1, //IE内核
                    presto: u.indexOf('Presto') > -1, //opera内核
                    webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
                    gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
                    mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
                    ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
                    android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
                    iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
                    iPad: u.indexOf('iPad') > -1, //是否iPad
                    webApp: u.indexOf('Safari') == -1, //是否web应该程序，没有头部与底部
                    weixin: u.indexOf('MicroMessenger') > -1, //是否微信 （2015-01-22新增）
                    qq: u.match(/\sQQ/i) == " qq" //是否QQ
                };
            }(),
            language: (navigator.browserLanguage || navigator.language).toLowerCase()
        }
    </script>
    <script type="text/javascript">
        var isJson = function(obj) {
                var isjson = typeof(obj) == "object" && Object.prototype.toString.call(obj).toLowerCase() == "[object object]" && !obj.length;
                return isjson;
            }
            /*
             *使用JS跨域的方案，向服务器请求数据
             *测试服务器使用的代码
             */
        function fetchData(url, callback) {
            this.callback = callback;
            var script = document.createElement("script");
            script.src = url;
            script.type = "text/javascript";
            script.id = "id_event_data";
            script.onerror = function(e) {
                if (callback != null) {
                    callback(null);
                }
            }
            var head = document.getElementsByTagName("head");
            if (head && head[0]) {
                try {
                    head[0].appendChild(script);
                } catch (e) {}
            }
        }
        fetchData.prototype.onCallback = function(data) {
            if (this.callback != null) {
                this.callback(data);
            }
        }
        var response = fetchData.prototype.onCallback;
    </script>
    <script type="text/javascript">
        var xmlhttp;

        function loadHttp(url, callback) {
            if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else { // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4) {
                    if (xmlhttp.status == 200) {
                        if (callback != null) {
                            callback(xmlhttp.responseText);
                        }
                    } else {
                        if (callback != null) {
                            callback(null);
                        }
                    }
                }
            };
            xmlhttp.open("GET", url, true);
            xmlhttp.send();
        }
    </script>
    <script type="text/javascript">
        function isWeiXin() {
            var ua = window.navigator.userAgent.toLowerCase();
            console.log(ua); //mozilla/5.0 (iphone; cpu iphone os 9_1 like mac os x) applewebkit/601.1.46 (khtml, like gecko)version/9.0 mobile/13b143 safari/601.1
            try {
                if (ua.match(/MicroMessenger/i) == 'micromessenger') {
                    return true;
                } else {
                    return false;
                }
            } catch (e) {}
            return false
        }
    </script>
    <script type="text/javascript">
        var WX_DOWNLOAD_MARK = "type=wx_download";

        var global_appinfo = null;

        function updateContent(app_icon, app_title, app_version, app_evalution,
            app_size, app_downtimes, app_desc, downUrl, previewUrls) {
            document.title = app_title;
            document.getElementById("first_hide_img").src = app_icon;
            document.getElementById("app_icon").src = app_icon;
            document.getElementById("app_title").innerText = app_title;
            document.getElementById("app_version").innerText = app_version;
            document.getElementById("app_evalution").innerText = app_evalution;
            document.getElementById("app_size").innerText = app_size;
            document.getElementById("app_downtimes").innerText = app_downtimes;
            document.getElementById("app_desc").innerText = app_desc;
            document.getElementById("down_link").href = downUrl;
            document.getElementById("down_link").onclick = ondownload;
            updateImagePreview(previewUrls);
            try {
                var hasInstalled = android.hasInstalled(global_appinfo.app_pkgname)
                if (hasInstalled) {
                    document.getElementById("down_link").innerText = "打开"
                } else {
                    document.getElementById("down_link").innerText = "下载"
                }
            } catch (e) {
                console.log("error : " + e);
            }
        }

        function hasFullPreview() {
            var full_preview_div = document.getElementById("full_preview_div");
            return full_preview_div.style.display == "block";
        }

        function showFullPreview(url) {
            var full_preview_div = document.getElementById("full_preview_div");
            full_preview_div.style.display = "block";
            full_preview_div.onclick = function() {
                hideFullPreview();
            };
            var full_preview = document.getElementById("full_preview");
            full_preview.src = url;
        }

        function hideFullPreview() {
            var full_preview_div = document.getElementById("full_preview_div");
            full_preview_div.style.display = "none";
        }

        function updateImagePreview(preview_urls) {
            var previewUl = document.getElementById("preview_ul");
            for (var i in preview_urls) {
                var li = document.createElement("li");
                var img = document.createElement("img");
                img.src = preview_urls[i];
                img.onclick = function() {
                    showFullPreview(this.src);
                };
                li.appendChild(img);
                previewUl.appendChild(li);
            }
        }

        function getId() {
            var url = window.location.href;
            if (url != null) {
                var s = url.split("?");
                if (s != null && s.length > 1) {
                    q = s[1].split("&");
                    if (q != null && q.length > 0) {
                        for (var a in q) {
                            var arg = q[a];
                            if (arg != null) {
                                var t = arg.split("=");
                                if (t != null && t.length > 1) {
                                    if (t[0] == "id") {
                                        return t[1];
                                    }
                                }
                            }
                        }
                    }
                }
            }
            return null;
        }

        function rquestAppInfo() {
            var id = getId();
            if (id != null) {
                if (false) {
                    var reqUrl = "config/" + id + ".json";
                    loadHttp(reqUrl, onAppInfoCallback)
                } else {
                    var reuUrlJsonp = "https://taugin.gitee.io/web/config/" + id + "_jsonp.json";
                    fetchData(reuUrlJsonp, onAppInfoCallback);
                }
            } else {
                showError();
            }
        }

        function onAppInfoCallback(data) {
            var appInfo = null;
            if (isJson(data)) {
                appInfo = data;
            } else {
                appInfo = eval("(" + data + ")");
            }
            if (appInfo != null && typeof appInfo == "object") {
                global_appinfo = appInfo;
                var downUrl = appInfo.app_url_android;
                if (browser.versions.ios) {
                    downUrl = appInfo.app_url_ios;
                }
                updateContent(appInfo.app_icon, appInfo.app_title, appInfo.app_version, appInfo.app_evalution,
                    appInfo.app_size, appInfo.app_downtimes, appInfo.app_desc, downUrl, appInfo.app_prevurls);

                var progress_div = document.getElementById("progress_div");
                progress_div.style.display = "none";
                var container = document.getElementById("container");
                container.style.display = "block";
            } else {
                showError();
            }
        }

        function showError() {
            var app_not_found = document.getElementById("app_not_found");
            app_not_found.style.display = "block";
            var progress_div = document.getElementById("progress_div");
            progress_div.style.display = "none";
        }

        window.onload = function() {
            rquestAppInfo();
            processMotion();
        }

        function clickDownload() {
            document.getElementById("down_link").click();
            setTimeout(function() {
                removeWxMark();
            }, 500);
        }

        function ondownload() {
            try {
                android.execute(global_appinfo.app_title,
                    global_appinfo.app_pkgname,
                    global_appinfo.app_version,
                    global_appinfo.app_appsflyer);
                return false;
            } catch (e) {
                console.log("error : " + e);
            }
            return true;
        }

        function processMotion() {
            var full_preview_div = document.getElementById("full_preview_div");
            var full_preview = document.getElementById("full_preview");
            var app_not_found = document.getElementById("app_not_found");
            disableMotion([full_preview_div, full_preview, app_not_found]);
        }

        function disableMotion(els) {
            if (els != null && els.length > 0) {
                for (var a in els) {
                    els[a].addEventListener("touchmove", function(e) {
                        e.preventDefault();
                    }, false);
                    els[a].addEventListener("touchmove", function(e) {
                        e.preventDefault();
                    }, false);
                    els[a].addEventListener("scroll", function(e) {
                        e.preventDefault();
                    }, false);
                    els[a].addEventListener("scroll", function(e) {
                        e.preventDefault();
                    }, false);
                    els[a].addEventListener("mousewheel", function(e) {
                        e.preventDefault();
                    }, false);
                    els[a].addEventListener("mousewheel", function(e) {
                        e.preventDefault();
                    }, false);
                }
            }
        }
    </script>
</head>

<body>
    <div id="container" class="container">
        <img id="first_hide_img" style="position:fix;z-index:-1;width:0;height:0;display:inherit"></img>
        <div class="app_icon_div">
            <img class="app_icon" id="app_icon"></img>
            <div class="app_info">
                <table class="app_table" border=0 cellspacing=0>
                    <tr style="padding:0;">
                        <td>
                            <h3 id="app_title"></h3>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h5>版本:
                                <span id="app_version"></span>
                            </h5>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <h5>评分:
                                <span id="app_evalution"></span>
                            </h5>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <div class="app_size_downtimes">
            <h5 class="app_downtimes">大小:
                <span id="app_size"></span>
            </h5>&nbsp;&nbsp;
            <h5 class="app_downtimes">下载次数:
                <span id="app_downtimes">60</span>
            </h5>
        </div>
        <div class="app_desc_div">
            <p>应用简介</p>
            <p class="app_desc" id="app_desc"></p>
        </div>
        <div class="img_preview">
            <ul id="preview_ul">
            </ul>
        </div>
        <div class="bottom">
            <a class="app_open" id="down_link" target="_blank">下载</a>
        </div>
    </div>
    <div id="wx_tip" class="wx_tip">
        <img src="images/live_weixin.png" style="width:90%;height:auto;margin:0,1em,0,1em" />
    </div>
    <div id="full_preview_div">
        <img id="full_preview" style="width:auto;height:100%;" />
    </div>
    <div id="app_not_found">
        <img src="images/page_404.jpg" style="width:auto;height:100%;" />
    </div>
    <div id="progress_div">
        <img src="images/small_progress.gif" style="width:auto;height:auto;" />
    </div>
</body>

</html>